/* 1. 定义变量 */
:root{
   /* 全局作用域 定义变量   */
   --main-color: #F00
}
.list {
    /* 局部作用域 */
    --main-color-1: #FF0;

   background-color: var(--main-color-1);

   color: var(--main-color);
}

.box {
    color: var(--main-color)
}